import QtQuick 2.0
import QtQuick.Controls 2.2
import Toou2D 1.0
import cn.conchit 1.0

//图像显示头标签
TRectangle {
    id: imageShowArea
    width: parent.width * 3 / 4;
    height: parent.height

    color: "#196E6C";
    radius: 4
    theme.enabled: false;

    function changeLabelSel(newLabel) {
        image_cavas.curLabelName = newLabel.labelName
        image_cavas.curLabelColor = newLabel.labelColor
        image_cavas.curSeq = newLabel.seq
    }

    function dealWithImage(index) {
        image_cur.source = "file:///" + imageShowArea_body.getCurrentImageName(index)
        image_cur.scale = 1
        image_cur.x = (imageShowArea_body.width - image_cur.width) /2
        image_cur.y = (imageShowArea_body.height - image_cur.height) /2
        msArea_rightButton.fixDrag()
        var res = JSON.parse(ImageLabelModel.resetModel(index));
        if(res.retVal === -1) {
            TToast.showError(res.retStr, TTimePreset.ShortTime2s);
        }

        image_cavas.requestPaint()
    }

    function clearAll() {
        ImageLabelModel.clearAll();
        image_cavas.requestPaint();
    }

    function removeLast() {
        ImageLabelModel.removeLast();
        image_cavas.requestPaint();
    }

    TLabel{
        id: imageShowArea_head
        x:10;
        y:10;
        height: 20
        color: "#FFF"
        text: "图像显示" ;
        anchors.horizontalCenter: parent.horizontalCenter;
        theme.enabled: false;
    }

    Rectangle {
        id: imageShowArea_body
        visible: true
        width: parent.width
        anchors.top: imageShowArea_head.bottom
        anchors.bottom: parent.bottom;
        color: "#002B36";

        function getCurrentImageName(index) {
            return  ImageModel.getImageName(index);
        }

        Image {
            id: image_cur
            x:(imageShowArea_body.width - image_cur.width) /2
            y:(imageShowArea_body.height - image_cur.height) /2
            source: "file:///" + imageShowArea_body.getCurrentImageName(0)

            //鼠标点击坐标位置
            property real startX     //储存鼠标开始时的坐标
            property real startY
            property real stopX      //储存鼠标结束时的坐标
            property real stopY
            property bool isMouseMoveEnable: false //是否允许鼠标移动绘制事件

            Canvas {
                id: image_cavas
                width: image_cur.width; height: image_cur.height

                property string curLabelName
                property string curLabelColor
                property int curSeq

                function drawFromModel (ctx) {
                    ctx.clearRect(0,0,image_cur.width,image_cur.height)
                    ctx.lineWidth = 1
                    for(var i = 0;  i < ImageLabelModel.rowCount(); i++) {
                        var ctxLabel =  JSON.parse(ImageLabelModel.get(i)).retObj;
                        ctx.strokeStyle = ctxLabel.color
                        var ctx_X1 = ctxLabel.x1;
                        var ctx_Y1 = ctxLabel.y1;
                        var ctx_X2 = ctxLabel.x2;
                        var ctx_Y2 = ctxLabel.y2;
                        ctx.font = "18px bold 黑体";
                        //ctx.fillText(ImageLabelModel.get(i).name, ctx_X, ctx_Y);
                        //开始绘制
                        ctx.beginPath()
                        ctx.moveTo(ctx_X1,ctx_Y1)
                        ctx.lineTo(ctx_X1, ctx_Y2)
                        ctx.lineTo(ctx_X2, ctx_Y2)
                        ctx.lineTo(ctx_X2, ctx_Y1)
                        ctx.closePath()
                        ctx.font = "18px bold 黑体"
                        ctx.fillStyle = ctxLabel.color //ImageLabelModel.get(i).color
                        ctx.fillText(ctxLabel.name , Math.min(ctx_X1, ctx_X2) , Math.min(ctx_Y1, ctx_Y2));
                        ctx.stroke()
                    }

                }

                onPaint: {
                    var ctx = getContext("2d")
                    ctx.lineWidth = 1
                    drawFromModel(ctx);
                    if (image_cur.isMouseMoveEnable) {
                        ctx.strokeStyle = image_cavas.curLabelColor//"red";

                        image_cur.stopX = msArea_leftButton.mouseX
                        image_cur.stopY = msArea_leftButton.mouseY


                        //开始绘制
                        ctx.beginPath()
                        ctx.moveTo(image_cur.startX,image_cur.startY)
                        ctx.lineTo(image_cur.startX, image_cur.stopY)
                        ctx.lineTo(image_cur.stopX, image_cur.stopY)
                        ctx.lineTo(image_cur.stopX, image_cur.startY)
                        ctx.closePath()
                        ctx.font = "18px bold 黑体"
                        ctx.fillStyle = image_cavas.curLabelColor
                        ctx.fillText(image_cavas.curLabelName , Math.min(image_cur.startX, image_cur.stopX) , Math.min(image_cur.startY, image_cur.stopY));
                        ctx.stroke()
                    }

                }

            }

            MouseArea {
                id: msArea_rightButton
                anchors.fill: parent
                acceptedButtons: Qt.RightButton | Qt.MiddleButton

                drag.target: image_cur

                function fixDrag() {
                    /*
                    缩放计算规则：val对应的是image_cur.width和image_cur.height
                    缩小：(即image_cur.scale < 1)
                        min:初始值+val*(1-image_cur.scale) / 2
                        max:初始值-val*(1-image_cur.scale) / 2
                    放大：(即image_cur.scale > 1)
                        min:初始值-val*(image_cur.scale-1) / 2
                        max:初始值+val*(image_cur.scale-1) / 2
                    */
                    drag.minimumX = (image_cur.width * image_cur.scale > imageShowArea_body.width) ? (imageShowArea_body.width - image_cur.width - image_cur.width * (image_cur.scale - 1) / 2) : image_cur.width * (image_cur.scale - 1) / 2
                    drag.minimumY = (image_cur.height * image_cur.scale > imageShowArea_body.height) ? (imageShowArea_body.height - image_cur.height - image_cur.height * (image_cur.scale - 1) / 2) : image_cur.height * (image_cur.scale - 1) / 2
                    drag.maximumX = (image_cur.width * image_cur.scale > imageShowArea_body.width) ? image_cur.width * (image_cur.scale - 1) / 2 : (imageShowArea_body.width - image_cur.width * image_cur.scale) + image_cur.width * (image_cur.scale - 1) / 2
                    drag.maximumY = (image_cur.height * image_cur.scale > imageShowArea_body.height) ? image_cur.height * (image_cur.scale - 1) / 2 : (imageShowArea_body.height - image_cur.height * image_cur.scale) + image_cur.height * (image_cur.scale - 1) / 2

                }


                Component.onCompleted: {
                    drag.minimumX = (image_cur.width > imageShowArea_body.width) ? (imageShowArea_body.width - image_cur.width) : 0
                    drag.minimumY = (image_cur.height > imageShowArea_body.height) ? (imageShowArea_body.height - image_cur.height) : 0
                    drag.maximumX = (image_cur.width > imageShowArea_body.width) ? 0 : (imageShowArea_body.width - image_cur.width)
                    drag.maximumY = (image_cur.height > imageShowArea_body.height) ? 0 : (imageShowArea_body.height - image_cur.height)
                }

                onWheel: function(wheel) {
                    if (wheel.modifiers & Qt.ControlModifier ){
                        var datla = wheel.angleDelta.y / 120
                        if (datla > 0) {
                            image_cur.scale = image_cur.scale * 1.1
                            /*
                                    if (image_cur.scale < 5) {
                                        image_cur.scale = image_cur.scale * 1.1
                                        var image_cur_centerX = (image_cur.x + image_cur.x + image_cur.width) / 2
                                        var image_cur_centerY = (image_cur.y + image_cur.y + image_cur.height) / 2
                                        if(wheel.x  - image_cur_centerX < 0) {
                                            image_cur.x += (wheel.x  - image_cur_centerX) * 0.1
                                        } else {
                                            image_cur.x -= (wheel.x  - image_cur_centerX) * 0.1
                                        }

                                        if(wheel.y  - image_cur_centerY < 0) {
                                            image_cur.y += (wheel.y  - image_cur_centerY) * 0.1
                                        } else {
                                            image_cur.y -= (wheel.y  - image_cur_centerY) * 0.1
                                        }
                                    }
                                    */
                        } else {
                            image_cur.scale = image_cur.scale * 0.9
                         }
                        fixDrag()
                    }
                }

                onClicked: function(mouse) {
                    if(mouse.button===Qt.MiddleButton){
                         image_cur.scale = 1
                         image_cur.x = (imageShowArea_body.width - image_cur.width) /2
                         image_cur.y = (imageShowArea_body.height - image_cur.height) /2
                        fixDrag()
                    }
                }

                onDoubleClicked: function(mouse) {
                    if(mouse.button===Qt.RightButton){

                        var image_cur_centerX = (image_cur.x + image_cur.x + image_cur.width) / 2
                        var image_cur_centerY = (image_cur.y + image_cur.y + image_cur.height) / 2
                        var tmp_LX, tmp_TY, tmp_RX, tmp_BY
                        tmp_LX = image_cur.x - (mouse.x  - image_cur_centerX)
                        tmp_TY = image_cur.y - (mouse.y  - image_cur_centerY)
                        tmp_RX = tmp_LX + image_cur.width
                        tmp_BY = tmp_TY + image_cur.height
                        if ((0 < tmp_LX && tmp_LX < image_cur.width) && (0 < tmp_TY && tmp_TY < image_cur.height)   ) {
                            image_cur.x = tmp_LX
                            image_cur.y = tmp_TY
                        }
                        if ((0 < tmp_RX && tmp_RX < image_cur.width) && (0 < tmp_TY && tmp_TY < image_cur.height)   ) {
                            image_cur.x = tmp_LX
                            image_cur.y = tmp_TY
                        }
                        if ((0 < tmp_LX && tmp_LX < image_cur.width) && (0 < tmp_BY && tmp_BY < image_cur.height)) {
                            image_cur.x = tmp_LX
                            image_cur.y = tmp_TY
                        }
                        if ((0 < tmp_RX && tmp_RX < image_cur.width) && (0 < tmp_BY && tmp_BY < image_cur.height)) {
                            image_cur.x = tmp_LX
                            image_cur.y = tmp_TY
                        }
                        image_cur.scale = image_cur.scale * 1.5
                        fixDrag()                     }
                 }

                onPressed: function(mouse) {
                    coustomCusor.visible = false
                    msArea_leftButton.cursorShape = Qt.OpenHandCursor
                }

                onReleased: function(mouse) {
                    msArea_leftButton.cursorShape = Qt.ArrowCursor

                }
            }

            MouseArea {
                id: msArea_leftButton
                anchors.fill: parent
                acceptedButtons: Qt.LeftButton
                hoverEnabled: true							//监测光标位置变化

                //当鼠标释放时调用本函数
                onReleased: function(mouse) {
                    image_cur.isMouseMoveEnable = false
                    //记录移动终点
                    image_cur.stopX = msArea_leftButton.mouseX
                    image_cur.stopY = msArea_leftButton.mouseY

                    if ((image_cur.startX === image_cur.stopX) || (image_cur.startY === image_cur.stopY)) {
                        return
                    }
                    image_cavas.requestPaint()      //当鼠标released时，调用绘制paint
                    ImageLabelModel.append(image_cavas.curSeq, image_cavas.curLabelName, image_cavas.curLabelColor,
                                                 image_cur.startX, image_cur.startY, image_cur.stopX, image_cur.stopY)

                }


                onPositionChanged: function(mouse) {
                    //移动光标素材到光标位置
                    coustomCusor.x = mouse.x - coustomCusor.width /2
                    coustomCusor.y = mouse.y - coustomCusor.height /2

                    if (image_cur.isMouseMoveEnable){
                        image_cavas.requestPaint()   //绘制函数
                    }
                }
                //光标素材
                Image {
                    id: coustomCusor
                    source: "qrc:/images/crossline.png"
                    visible: false
                }

                onPressed: function(mouse) {
                    image_cur.startX = mouse.x;
                    image_cur.startY = mouse.y;
                    image_cur.isMouseMoveEnable = true
                }

                onDoubleClicked: function(mouse) {
                    coustomCusor.visible = !coustomCusor.visible
                }

                onExited: function(e) {
                    coustomCusor.visible = false
                }
            }


        }



    }

}

